<template>
  <div class="dmform dmform-right" v-loading="loading">
    <a-tabs default-active-key="1" style="margin:0 10px;" :animated="false">
      <a-tab-pane key="1" tab="分组信息">
        <div class="dmform-groups">
          <a-form-model ref="form" :model="formData" :rules="formRules" :label-col="formLabelCol" :wrapper-col="formWrapperCol">
            <div class="dmform-group dmform-group-scroll" :style="{maxHeight:pageHeight-95+'px'}">
              <a-form-model-item label="所属上级">
                <a-input :value="formData.parentName" disabled />
              </a-form-model-item>
              <a-form-model-item prop="name" has-feedback label="分组名称" help="如：过控项目组">
                <a-input v-model="formData.name" v-focus />
              </a-form-model-item>
              <a-form-model-item label="分组全称" help="如：云南安科院 / 安信公司 / 过控项目组">
                <a-input v-model="formData.fullName" :maxLength="256">
                  <a-button slot="addonAfter" type="link" size="small" @click="doAutoFullName">自动生成</a-button>
                </a-input>
              </a-form-model-item>
            </div>
          </a-form-model>
        </div>
        <div class="dmform-bottom">
          <a-button @click="doSubmit" type="primary" :loading="submitting">{{ saveButtonText }}</a-button>
        </div>
      </a-tab-pane>
      <a-tab-pane key="2" tab="职位(岗位)设置" :disabled="!pageParams.id">
        <div class="dmform-group dmform-group-scroll" style="padding: 20px;" :style="{maxHeight:pageHeight-53+'px'}">
          <a-form-model-item help="设置适用于该分组的职位(岗位)">
            <TreeTransfer
                left-data-url="/jsofted/post/tree"
                right-add-url="/jsofted/postOrg/add"
                right-delete-url="/jsofted/postOrg/deleteBy"
                leftField="orgId"
                rightField="postId"
                :leftValue="pageParams.id"
                left-title="可以选择的职位(岗位)"
                right-title="适用于该分组的职位(岗位)"
            >
            </TreeTransfer>
          </a-form-model-item>
        </div>
      </a-tab-pane>
    </a-tabs>
  </div>
</template>
<script>
import DataFormUtils from '@/utils/DataFormUtils'

export default {
  mixins: [DataFormUtils],
  data() {
    return {
      loadUrl: '/jsofted/group/get/',
      addUrl: '/jsofted/group/add',
      updateUrl: '/jsofted/group/update/',
      deleteUrl: '/jsofted/group/delete/',
      defaultValues: {
        type: 'group',
      },
      formData: {
        id: '',
        name: '',
        fullName: '',
        parentId: '',
        parentName: '',
        type: 'group',
        members: null,
      },
      formRules: {
        name: [
          { required: true, message: '不能为空！', trigger: 'change' },
          { min: 2, max: 30, message: '长度为2-30个字！', trigger: 'change' },
        ],
      },
    }
  },
}
</script>
